<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>商学院</title>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../../css/commontCust.css" />
		<link rel="stylesheet" type="text/css" href="../../css/mui.min.css" />
		<style>
			.mui-slider-indicator .mui-active.mui-indicator {
				background: #2A36D8
			}
			
			ul {
				margin: 4px 0px 8px 0px;
				padding: 0px;
				height: 100%;
				width: 96%;
				list-style-type: none;
			}
			
			li {
				margin-top: 6px;
			}
			
			.liDivWrap {
				width: 100%;
				height: 120px;
				background: white;
				padding: 10px;
			}
			
			img {
				border-radius: 5px;
			}
		</style>
	</head>

	<body>
		<div style="height: 100%;width: 100%;" class="divColumn divCenter">
			<div style="height: 48px;width: 100%;background-color: #05508a;position: fixed;top: 0px;z-index: 99;" class="divRow divColumnCenter">

				<div style="width: 30%;height: 100%;padding-left: 10px;" class="divColumnCenter" id="btnBack">

					<img src="../../img/left_back.png" />
				</div>

				<div style="width: 80%;height: 100%;" class="divCenter">
					<span style="color: white;font-size: 18px;">商学院</span>
				</div>
				<div style="width: 30%;height: 100%;padding-right: 10px;" class="divCenter">

				</div>

			</div>
			<div style="width: 96%;height: auto;margin-top: 50px;">
				<div id="slider" class="mui-slider">
					<div class="mui-slider-group mui-slider-loop" style="height: 170px;" id="divBanner">
						<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
						<div class="mui-slider-item mui-slider-item-duplicate">
							<a href="#">
								<img src="../../img/banner1.png">
							</a>
						</div>
						<!-- 第一张 -->
						<div class="mui-slider-item">
							<a href="#">
								<img src="../../img/banner1.png">
							</a>
						</div>
						<div class="mui-slider-item">
							<a href="#">
								<img src="../../img/banner2.png">
							</a>
						</div>
						<div class="mui-slider-item">
							<a href="#">
								<img src="../../img/banner3.png">
							</a>
						</div>
						<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
						<div class="mui-slider-item mui-slider-item-duplicate">
							<a href="#">
								<img src="../../img/banner3.png">
							</a>
						</div>
					</div>
					<div class="mui-slider-indicator">
						<div class="mui-indicator mui-active"></div>
						<div class="mui-indicator"></div>
						<div class="mui-indicator"></div>
					</div>
				</div>

			</div>
			<ul id="content" v-cloak>
				<li v-for="(item,index) in dataList">

					<div class="liDivWrap divRow" @tap='itemClick(index)'>

						<img src="../../img/banna_img.png" style="width: 40%;object-fit: cover;" />

						<div style="width: 60%;height: 100%;" class="divColumn">
							<span style="height: 70%;width: 100%;text-align: justify;font-size: 14px;padding-left: 10px;">
								对于这场电影的“午夜狂欢”，众多
影迷期盼已久......
							</span>
							<div style="width: 100%;height: 30%;padding-left: 10px;" class="leftAndRight">
								<span style="font-size: 14px;color: #999999;">2019-04-29  16:22</span>

							</div>
						</div>

					</div>

				</li>

			</ul>

		</div>

		<script src="../../js/mui.min.js"></script>
		<script src="../../js/config.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../mall/vue/vue.min.js"></script>
		<script src="../../mall/vue/swiper/swiper.min.js"></script>
		<script src="../../mall/vue/vue-scroller.min.js"></script>
		<script src="../../js/jquery-2.1.4.js"></script>

		<script>
			mui.init();
			mui.back();
			var content = new Vue({
				el: '#content',
				data: {
					dataList: [{}, {}, {}],
				},

				created: function() {

				},
				beforeMount: function() {
					var slider = mui("#slider");
					slider.slider({
						interval: 3000
					});
				},
				mounted: function() {

				},
				methods: {
					itemClick: function(idnex_) {
						mui.openWindow({
							url: 'sxy_details.html',
							id: 'sxy_details.html'

						})

					}

				}

			});

			$('#btnBack').click(function() {
				mui.back();

			});
			//			mui('#slider').on('tap', 'a', function() {
			//				mui.openWindow({
			//					url: 'sxy_details.html',
			//					id: 'sxy_details.html'
			//
			//				})
			//
			//			});
		</script>

	</body>

</html>